<template>
    <el-select
            v-model="selectId"
            filterable
            remote
            reserve-keyword
            placeholder="输入关键字"
            remote-show-suffix
            :remote-method="remoteMethod"
            :loading="loading"
            style="width: 240px"
    >
        <el-option
                v-for="item in options"
                :key="item.value"
                :label="item.label"
                :value="item.value"
        />
    </el-select>
</template>

<script setup>
    import { ref } from 'vue'
    import request from '@/utils/request.js'
    const options = ref([])
    const selectId = ref()
    const loading = ref(false)
    defineExpose({selectId})

    const remoteMethod = (keyword) => {
        loading.value = true
        request.get(`/api/pmsSkuInfo/getSkuListByKeyWord/${keyword}`).then(resp => {
            options.value.splice(0, options.length)
            options.value = resp.map(e=>{
                return {value:e.value, label:e.label}
            })
            loading.value = false
        })
    }

</script>